import React, { Component } from 'react';
import {View, Image, Navigator} from '@tarojs/components'
import PriceLabel from '../price-label/price-label'
import './limit-good.scss'

interface PageState {
  title: string
  price: number
  marketPrice: number
  image: string
  url: string
  zeroBuy?: number
}

export default class LimitGood extends Component<PageState> {
  static defaultProps = {
    title: '',
    price: 0,
    marketPrice: 0,
    image: '',
    url: '',
    zeroBuy: 0
  }

  render() {
    const {url, image, title, zeroBuy, price, marketPrice} = this.props
    return (
      <Navigator className='limitGoodRoot' hoverClass='none' url={url}>
        <View className='top'>
          <View className='image-box'>
            <Image src={image} mode='aspectFill' />
          </View>
          <View className='title-box'>{title}</View>
        </View>
        <View className='bottom'>
          <View className='price-box'><PriceLabel title='开抢价' price={zeroBuy != 1 ? price : 0}
            showMark marketPrice={marketPrice}
          /></View>
          <View className='btn'>立即抢购</View>
        </View>
      </Navigator>
    )
  }
}
